
function centerMainElements(isNew){
	var f = $('footer');
	var c = $('content');
	var h = $('header');
	
	f.hide();
	c.hide();
	h.hide();
	
	setupHeader();
	setUpFooter();
	
	f.appear();
	c.appear();
	h.appear();
};

function calculateTopMargin(element){
  var parent = Element.getOffsetParent(element);
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myHeight = window.innerHeight;
  } else if( document.documentElement && document.documentElement.clientHeight) {
    //IE 6+ in 'standards compliant mode'
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && document.body.clientHeight) {
    //IE 4 compatible
    myHeight = document.body.clientHeight;
  }
  return myHeight;	
};

function setupHeader(){
  var h = $('header');
  
  var nextIco = new Element('img');
  nextIco.src = 'res/ico/next.png';
  nextIco.style.width = '16px'
  nextIco.alt = 'NEXT >>';
  
  var next = new Element('div');
  next.id = 'next';
  next.insert(nextIco);
  
  var center = new Element('div');
  center.id = 'hcenter';
  center.insert(' FriendFeed<br/><i>Reader</i>');

  var prevIco = new Element('img');
  prevIco.src = 'res/ico/prev.png';
  prevIco.style.width = '16px'
	  prevIco.alt = 'PREV >>';
  
  var prev = new Element('div');
  prev.id = 'prev';
  prev.insert(prevIco);
  
  var hidden = new Element('div');
  hidden.hide();
  hidden.style.clear = 'both';
  hidden.style.display =  'block';

  next.observe('click', scrollToNext);
  prev.observe('click', scrollToPrev);
  
  h.insert(prev);
  h.insert(center);
  h.insert(next);
  h.insert(hidden);
}

function setUpFooter(){
  var f = $('footer');
  
  var option = new Element('span');
  option.id = 'optionWidget';
  option.insert('[option]');
  option.title = 'show option panel';
  option.observe('click', function(){
	  setUsername();
  });
    
  var close = new Element('span');
  close.id = 'closeWidget';
  close.title = 'close';
  close.insert('[X]');
  close.observe('click', function(){
	$('body').fade({duration: 2.0});
	window.close(); 
  });
  
  
  var hidden = new Element('div');
  hidden.hide();
  hidden.style.clear = 'both';
  hidden.style.display =  'block';
  
  f.insert(option);
  f.insert(close);
  f.insert(hidden);
}

var FFEntryUI = Class.create({
  initialize: function(k, entry){
	this.div = new Element('div');
	this.div.id = 'feed' + k;
	this.div.className = 'feed';
	this.entry = entry;
	this.div.insert(this.showVia(this.entry));
	this.div.insert(entry.getBody());
	this.div.insert(this.showCommentsCount(this.entry));
	
  },

  showCommentsCount: function(entry){
	var divC = null;   
	var div = new Element('div');
	div.id = this.div.id + '_commentsCount';
	div.className = 'commentsCount';
	
	var span = new Element('span');
	span.insert('[+/-]');
	span.title = 'click to show/hide comments';
	span.id = this.div.id + '_commentsShowHide';
	span.className = 'commentsShowHide';
	
	div.insert(entry.getNumberOfComments() + ' comments ');
	div.insert(span);
	if(entry.getNumberOfComments()>0){
	  var divC = new Element('div');
	  divC.id = this.div.id + '_comments';	
	  divC.className = 'comments';
	  divC.hide();
	  for(var k=0; k<entry.getNumberOfComments(); k++){
		var comment = new Element('div');
		comment.className = 'comment';
		comment.id = this.div.id + '_comments_'+k;	
		var com = entry.comments[k];
		if(com!=null){
		  comment.insert('  >> ');
		  comment.insert(com.body + ' [' + com.date + ']');
		  divC.insert(comment);
		}
	  }
	  div.insert(divC);
	}
	span.observe('click', function(){
		if(divC!=null && divC.style.display=='none'){
			new Effect.Parallel([
			  new Effect.BlindDown(divC, {sync: true}),
			  new Effect.Appear(divC, {sync: true})
			], {duration: 1.0});
		}else if(divC!=null && divC.style.display!='none'){
			new Effect.Parallel([
   			  new Effect.BlindUp(divC, {sync: true}),
   			  new Effect.Fade(divC, {sync: true})
   			], {duration: 1.0});
		}	
	});
	return div;
  },
  
  showVia: function(entry){
		var div = new Element('span');
		div.id = this.div.id + '_via';
		div.className = 'via';
		if(entry.getVia().getUrl()!=null){
		  var a = new Element('a');
		  a.href = entry.getVia().getUrl();
		  a.title = a.href;
		}  
		var viaName = null;
		try{
		  viaName = entry.getVia().getName().toLowerCase();
		}catch(e){}
		var icon = entry.getVia().getIcon();
		if(entry.getVia().getUrl()!=null){
		  a.insert(icon);
		  div.insert(a);
		}else{
		  div.insert(icon);	
		}  
		return div;
  }
});


var FFLoading = Class.create({
	initialize: function(){
	  this.loading = new Element('div');
	  this.loading.hide();
  	  this.loading.id = 'loading';
  	  $('body').insert(this.loading);
  	  this.loading.style.marginBottom = calculateTopMargin(this.loading)/2 + 50 + 'px';
    },
    
    start: function(){
  	  this.loading.appear({duration: 2.0});
    },
    
    stop: function(){
      this.loading.fade({duration: 2.0});	
    },

    setLoadingText: function(txt, alone){
      var p = new Element('p');
      p.id = 'loadingText';
  	  p.insert(txt);
  	  if(alone){
  	    this.loading.update(p);
  	  }else
  		this.loading.insert(p);  
    },
    
    setLoadingImage: function(image, alone){
      var img = new Element('img');
      img.id = 'loadingImg';
      img.src = image;
      if(alone){
    	  this.loading.update(img);
      }else
    	  this.loading.update(img); 
    },
    
    setLoadingImageAndText: function(image, txt, option){
      if(option.textUp=='true'){
    	  var img = this.setLoadingImage(image, false);
          var txt = this.setLoadingText(txt, false);
      }else{
          var txt = this.setLoadingText(txt, false);
    	  var img = this.setLoadingImage(image, false);
      }
    }
});

var FFOptionPanel = Class.create({
  initialize: function(){
	this.optionP = new Element('div');
	this.optionP.id = 'login';
	this.optionP.hide();
	
	this.optionP.insert(this.getHeader());
	this.optionP.insert('<br/>');
	this.optionP.insert(this.setNewUsername());
	this.optionP.insert('<br/>');
	this.optionP.insert(this.getInfo());
  },
  
  getHeader: function(){
	var header = new Element('div');
	header.id = 'loginH';
	header.insert('FreindFeed<i>Reader</i><br/>Optins Panel');
	header.insert(this.getClose());
	return header;
  },
  
  setNewUsername: function(){
	var newUsr = new Element('div');
	newUsr.id = 'newUsr';
	var label = new Element('div');
	label.insert('insert username');
		
	var input = new Element('input');
	input.type='text';
	input.name='username';
	input.value= username;
	input.id = 'newUsername';
		
	var ok = new Element('button');
	ok.insert('OK');
	ok.observe('click', function(){
		username = input.value;
		//widget.setPreferenceForKey(username, 'username' );
		$('footer').update();
		$('content').update();
		$('header').update();
		try{$('moreFeed').remove();}catch(e){};
		$('login').slideUp({duration: 6.0});
		start(1);
	});
		
	var reset = new Element('button');
	reset.insert('Reset');
	reset.observe('click', function(){
		input.value = '';
	});
	
	newUsr.insert(label);
	newUsr.insert(input);
	newUsr.insert(ok);
	
	return newUsr;
  },
  
  getInfo: function(){
	var info = new Element('div');
	info.id = "info";
	info.insert('<br/>');
	info.insert('FriendFeed<i>Reader</i> version 0.1<br/>');
	info.insert('by Omar "0m4r" Adobati - www.adobati.it');
	info.insert('<br/>');
	return info;
  },
  
  getClose: function(){
	var close = new Element('span');
	close.id = 'close';
	close.insert('[x]');
	close.title = 'Close option panel';
	close.observe('click', function(){;
	  $('login').slideUp({duration: 2.0});
	});
	return close;
  },
  
  show: function(){
	$('login').appear({duration: 2.0});  
  }
	
});







